<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>资源类型管理</title>
		<meta name="Description" content="基于layUI数据表格操作"/>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../css/font.css">
		<link rel="stylesheet" href="../../css/weadmin.css">
		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
		<!--[if lt IE 9]>
	      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
	      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
	    <![endif]-->
		<style type="text/css">
			.layui-form-switch {
				width: 55px;
			}			
			.layui-form-switch em {
				width: 40px;
			}			
			.layui-form-onswitch i {
				left: 45px;
			}
			body{overflow-y: scroll;}
		</style>
		<script src="../../js/jquery-3.1.1.js"></script>
	</head>

	<body>
		<div class="weadmin-nav">
			<span class="layui-breadcrumb">
		        <a href="">资源管理</a>
		        <a>
		          <cite>类型管理</cite></a>
		      </span>
			<a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
				<i class="layui-icon" style="line-height:30px">&#x1002;</i>
			</a>
		</div>
		<div class="weadmin-body">
			<!--<div class="layui-row">
				<form class="layui-form layui-col-md12 we-search">
					<div class="layui-input-inline">
						<select name="cateid" id="node_ip">
							
						</select>
					</div>
					<div class="layui-inline">
						<input type="text" name="keyword" placeholder="请输入名称" autocomplete="off" class="layui-input">
					</div>
					<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
				</form>
			</div>-->
			<div class="weadmin-block">
				<button class="layui-btn" onclick="WeAdminShow('添加API','./typeadd.html',null,null)"><i class="layui-icon"></i>添加</button>
				
				<span class="fr" style="line-height:40px" id="strategy_total">总数：0 条</span>
			</div>
			<table class="layui-table" id="memberList">
				<thead>
					<tr>
						<!-- <th>
							<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
						</th> -->
						<th>ID</th>
						<th>名称</th>
						<th>状态</th>
						<th style="text-align:center;">操作</th>
					</tr>
				</thead>
				<tbody id ="table_brian">
					
					<!-- <tr data-id="1">
						<td>
							<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id="1"><i class="layui-icon">&#xe605;</i></div>
						</td>
						<td>1</td>
						<td></td>
						<td>0</td>
						<td>2</td>
						<td>1</td>
						<td>0</td>
						<td>0</td>
						<td>9527</td>
						<td class="td-manage">

							<a title="编辑" onclick="WeAdminEdit('编辑','./edit.html', 1, 600, 400)" href="javascript:;">
								<i class="layui-icon">&#xe642;</i>
							</a>
							
							
							<a title="删除" onclick="del(11)" href="javascript:;">
								<i class="layui-icon"></i>
							</a>
						</td>
					</tr> -->
				</tbody>
			</table>
			<div id= "page">
			
			</div>
			<!-- <div class="layui-table-page">
				<div id="layui-table-page1">
					<div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1">
						<a href="javascript:;" class="layui-laypage-prev layui-disabled" data-page="0">
							<i class="layui-icon"></i>
						</a>
						<span class="layui-laypage-curr">
							<em class="layui-laypage-em"></em>
							<em>1</em>
						</span>
						<a href="javascript:;" class="layui-laypage-next " data-page="2">
							<i class="layui-icon"></i>
						</a>
						<span class="layui-laypage-skip">到第
									<input type="text" min="1" value="1" class="layui-input">页
									<button type="button" class="layui-laypage-btn">确定</button>
						</span>
						<span class="layui-laypage-count">共 2 条</span>
						<span class="layui-laypage-limits">
							<select lay-ignore="">
								<option value="10" selected="">10 条/页</option>
								<option value="20">20 条/页</option>
								<option value="30">30 条/页</option>
								<option value="40">40 条/页</option>
								<option value="50">50 条/页</option>
								<option value="60">60 条/页</option>
								<option value="70">70 条/页</option>
								<option value="80">80 条/页</option>
								<option value="90">90 条/页</option>
							</select>
						</span>
					</div>
				</div>
			</div> -->
			<script src="../../lib/layui/layui.js" charset="utf-8"></script>
			<script src="list.js" type="text/javascript" charset="utf-8"></script>

		</div>
	</body>
	

	<script type="text/javascript">
		var pageSize = 10;
		$(function(){
			// layui.use(['element','form'], function(){
			//     var element = layui.element;
			//     var form = layui.form;
			//     var laypage = layui.laypage;
			//     var  layer = layui.layer;
			// 	form.on('select', function (data) {
			// 	//console.log(data.value)
			// 		apiTypeId = data.value;
			// 		getApiByItemId(data.value,1,pageSize,true);
			// 	});
			// });
			getApiType();

		})
		$(function(){
			

		})
		var isgetApiListFirst = true;

		function getApiType(){
			var userInfo = localStorage.getItem("userInfo")
			var user = JSON.parse(userInfo);
			var jwt = user.jwt;
			//此处str=true，标识获取根类型信息
			$.post("/inner/api/initApiType",{"jwt":jwt,"userId":user.user.uid,str:true},function(data){
				if(data.retSig == 200){

					var retData = data.httpRet;//目前未分页，因此没有list
					var str = "";
					for(var i=0;i<retData.length;i++){
						var iotGateDB = retData[i];
						// str +="<option value='" + iotGateDB.id + "'>"+iotGateDB.name+"</option>";
						apiTypeId = iotGateDB.id;//当前页面的APi类别id--"分类集合"
						getApiByItemId(apiTypeId,1,pageSize,true);//加载当前根类别下的所有APi类别
					}
					layui.form.render();
				}
			});
			
		}
		//选中的当前api，全局变量，用于子页面获取选中的id
		var curEditAPIId;
		
		function updateStrategy(obj,apiId){
			curEditAPIId = apiId;
			layer.open({
		        type: 2 //此处以iframe举例
		        ,title: '编辑API'
		        ,area: [($(window).width() * 0.9-200)+'px', ($(window).height() - 150)+'px']
		        ,content: './edit.html'
		        ,yes: function(index, layero){
	                var body = layer.getChildFrame('body', index);
	                var iframeWin = window[layero.find('iframe')[0]['name']];//得到iframe页的窗口对象，执行iframe页的方法：
	                iframeWin.getAPIInfo(pid);//调用子页面的方法，得到子页面返回的ids
	                /* $("#mediaPath").val(ids); */
	                layer.close(index);//需要手动关闭窗口
	            }
		        ,btn2: function(){
		          layer.closeAll();
		        }
		        ,success: function(layero){
		          layer.setTop(layero); //重点2
		        }
		      });
		}
		
		//删除一行数据
		function  delStrategy (obj,name, pid) {
			layer.confirm('您确认要删除\"'+name+'\"吗？', function(index) {
				//发异步删除数据
				var userInfo = localStorage.getItem("userInfo")
				var user = JSON.parse(userInfo);
				var jwt = user.jwt;
				$.post("/inner/api/deleteApiResource",{"jwt":jwt,"userId":user.user.uid,"str":pid},function(data){
					if(data.retSig == 200){
						$(obj).parents("tr").remove();
						layer.msg('已删除!', {
							icon: 1,
							time: 1000
						});
					}else {
						layer.msg('删除异常!', {
							icon: 5,
							time: 1000
						});
					}
					
				},"json");
				
			});
		}
	</script>
	<script type="text/javascript">
		var apiTypeId = "0";//api类别下拉框选中值全局参数，默认是“全部”

		function getApiByItemId(itemId,pageIndex,pageSize,initLaypage){
			var userInfo = localStorage.getItem("userInfo")
			var user = JSON.parse(userInfo);
			var jwt = user.jwt;
			$.post("/inner/api/initApiByItemId",{"jwt":jwt,"userId":user.user.uid,"str":itemId,"pageIndex":pageIndex,"pageSize":pageSize},function(data){
				if(data.retSig == 200){

					var retData = data.httpRet.list;
					var str = "";
					for(var i=0;i<retData.length;i++){
						var iotGateDB = retData[i];
						str +=
						'<tr data-id="' + iotGateDB.pId + '">' +
							/* '<td>'+
								'<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id="' + iotGateDB.id + '"><i class="layui-icon">&#xe605;</i></div>'+
							'</td>'+ */
							'<td>' + iotGateDB.id + '</td>'+
							'<td title="'+iotGateDB.name+'">' + (iotGateDB.name.length > 10 ? iotGateDB.name.substring(0,10)+"..." :  iotGateDB.name) + '</td>'+
							// '<td>'+(iotGateDB.needAuth == 0 ? "否"  : "是")+'</td>'+
							// '<td>'+(iotGateDB.uri == null ? "" :iotGateDB.uri ) +'</td>'+
							// '<td>'+ (iotGateDB.method == null ? "" : iotGateDB.method ) +'</td>'+
							'<td>'+(iotGateDB.status == 1 ? "正常" : "禁用 ")+'</td>'+
							'<td class="td-manage" style="text-align:center;">'+
								'<a title="编辑" onclick="updateStrategy(this,\'' + iotGateDB.id + '\')" href="javascript:;" style="margin-right:10px;"><i class="layui-icon">&#xe642;</i></a>'+
								'<a title="删除" onclick="delStrategy(this,\''+iotGateDB.name+'\',\''  + iotGateDB.id + '\')" href="javascript:;"><i class="layui-icon">&#xe640;</i></a>'+
							'</td>'+
						'</tr>'	;
					}
					var total = data.httpRet.total;
					$("#strategy_total").html("总数"+total+"条")
					$('#table_brian').html(str); 
					if(initLaypage){
						layui.use('laypage', function(){
							  var laypage = layui.laypage;
							  
							  //执行一个laypage实例
							  laypage.render({
							    elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
							    ,count: total //数据总数，从服务端得到
							    ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
							    ,jump: function(obj, first){
							        //obj包含了当前分页的所有参数，比如：
							        //console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
							        //console.log(obj.limit); //得到每页显示的条数
							        //首次不执行

							        if(!first){
							        	getApiByItemId(apiTypeId,obj.curr,obj.limit,false);//翻页的时候不重新加载
							        }else{
							        	
							        }
							      }
							  });
						});
					}
				}
			});
			
		}
	</script>
</html>